<div class="flexRow titleWrap">
  <div class="col12">
    <div class="flexRow">
      <div class="flexExpand">
        <label for="editListingTitle"><%= ob.polyT('editListing.title') %></label>
        <div class="js-cryptoTradingPairContainer"></div>
      </div>
      <%= ob.viewListingsT({ createMode: ob.createMode }) %>
    </div>
  </div>
</div>
<div class="flexRow gutterH">
  <div class="col6 simpleFlexCol">
    <label for="editListingCryptoContractType" class="required"><%= ob.polyT('editListing.type') %></label>
    <% if (ob.metadata.contractType === 'CRYPTOCURRENCY' && ob.errors['metadata.contractType']) print(ob.formErrorTmpl({ errors: ob.errors['metadata.contractType'] })) %>
    <select id="editListingCryptoContractType" name="metadata.contractType" class="clrBr clrP clrSh2 marginTopAuto">
      <% ob.contractTypes.forEach((contractType) => { %>
      <option value="<%= contractType.code %>" <% if (contractType.code === ob.metadata.contractType) print('selected') %>><%= contractType.name %></option>
      <% }); %>
    </select>
    <div class="clrT2 txSm helper">
      <%= ob.polyT('editListing.cryptoCurrencyType.helperType', {
        count: `<b>${ob.polyT('editListing.cryptoCurrencyType.helperTypeCount')}</b>`,
      }) %>
    </div>
  </div>
</div>
<div class="flexRow gutterH">
    <div class="col6 simpleFlexCol">
      <label for="editListingCoinType" class="required"><%= ob.polyT('editListing.cryptoCurrencyType.coinType') %></label>
      <% if (ob.errors['metadata.coinType']) print(ob.formErrorTmpl({ errors: ob.errors['metadata.coinType'] })) %>
      <div class="js-cryptoCurrencyTradeContainer marginTopAuto"></div>
    </div>
    <div class="col6 simpleFlexCol">
      <label for="editListingCryptoQuantity" class="required"><%= ob.polyT('editListing.cryptoCurrencyType.quantity') %></label>
      <% if (ob.errors['item.cryptoQuantity']) print(ob.formErrorTmpl({ errors: ob.errors['item.cryptoQuantity'] })) %>
      <div class="posR">
        <input type="text" class="clrBr clrP clrSh2" name="item.cryptoQuantity" id="editListingCryptoQuantity" value="<%= ob.number.toStandardNotation(ob.item.cryptoQuantity) %>" placeholder="0.00" data-var-type="bignumber">
        <%
          const selectedCoinType = ob.coinTypes ?
            ob.metadata.coinType || ob.coinTypes[0].code : '';
        %>
        <div class="cryptoQuantityCoinType clrT2 tx5 js-quantityCoinType"><%= selectedCoinType %></div>
      </div>
      <div class="clrT2 txSm helper"><%= ob.polyT('editListing.cryptoCurrencyType.helperQuantity') %></div>
    </div>
  </div>
</div>
<div class="flexRow gutterH">
  <div class="col6 simpleFlexCol">
    <label for="editListingCryptoReceive" class="required"><%= ob.polyT('editListing.cryptoCurrencyType.lblReceive') %></label>
    <div class="posR marginTopAuto">
      <%
        if (ob.errors['metadata.acceptedCurrencies'] &&
          ob.metadata.contractType === 'CRYPTOCURRENCY') {
          print(ob.formErrorTmpl({ errors: ob.errors['metadata.acceptedCurrencies'] }));
        }
      %>
      <select id="editListingCryptoReceive" name="metadata.acceptedCurrencies" class="clrBr clrP clrSh2 marginTopAuto">
        <% ob.receiveCurs.forEach(coin => { %>
          <option value="<%= coin.code %>" <% if (coin.code === ob.receiveCur) print('selected') %>><%= coin.name %></option>
        <% }) %>
      </select>
      <div class="clrT2 txSm helper"><%= ob.polyT('editListing.cryptoCurrencyType.helperReceive') %></div>
    </div>
  </div>
  <div class="col6 simpleFlexCol">
    <label for="editListingCryptoPriceModifier" class="required"><%= ob.polyT('editListing.cryptoCurrencyType.priceModifier') %></label>
    <% if (ob.errors['item.priceModifier']) print(ob.formErrorTmpl({ errors: ob.errors['item.priceModifier'] })) %>
    <div class="posR marginTopAuto">
      <input type="text" class="clrBr clrP clrSh2" name="item.priceModifier" id="editListingCryptoPriceModifier" value="<%= ob.item.priceModifier %>" placeholder="<%= ob.polyT('editListing.cryptoCurrencyType.priceModifierPlaceholder') %>" data-var-type="number">
      <div class="cryptoPriceModifierPercentSymbol clrT2 tx5">%</div>
    </div>
    <div class="clrT2 txSm helper"><%= ob.polyT('editListing.cryptoCurrencyType.helperPriceModifier') %></div>
  </div>
</div>